<template>
  <!-- 对话框(添加 / 修改) -->
  <el-dialog
    :title="title"
    :visible.sync="show"
    width="500px"
    append-to-body
    :before-close="cancel"
    :close-on-click-modal="false"
  >
    <el-row>
      <div class="group-name">基本信息</div>
      <el-col class="item" :span="12">学院:{{ form.collegeName }}</el-col>
      <el-col class="item" :span="12">系部:{{ form.departmentName }}</el-col>
      <el-col class="item" :span="12">班级:{{ form.className }}</el-col>
      <el-col class="item" :span="12"
        >角色:
        <dict-tag :type="DICT_TYPE.STUDY_CLOCK_ROLE" :value="form.clockRole"
      /></el-col>
      <el-col class="item" :span="12">姓名:{{ form.clockUserName }}</el-col>
      <el-col class="item" :span="12">基准打卡:{{ form.standardTime }}</el-col>
      <el-col class="item" :span="12">教室信息:{{ form.roomName }}人</el-col>
      <el-col class="item" :span="12"
        >打卡时间:{{ parseTime(form.clockTime) }}人</el-col
      >
      <el-col class="item" :span="12"
        >打卡结果:<dict-tag
          :type="DICT_TYPE.ACCOMMODATION_CLOCK_STATUS"
          :value="form.clockStatus"
      /></el-col>
    </el-row>
  </el-dialog>
</template>

<script>
export default {
  name: "ClockRecordEdit",
  components: {
  },
  data() {
    return {
      // 表单参数
      form: {}
    };
  },
  created() { },
  props: {
    // 是否显示弹出层
    show: {
      type: Boolean,
      default: false
    },
    // 显示弹出层标题
    title: {
      type: String,
      default: ''
    }
  },
  methods: {
    /** 初始化编辑的数据**/
    initData(rowData) {
      this.form = rowData;
    },
    cancel() {
      this.$emit("update:show", false);
    }
  }
};
</script>
<style lang="scss" scoped>
.item {
  padding: 10px 0;
}
.group-name {
  font-size: 18px;
  font-weight: bold;
  border-bottom: 1px solid #ccc;
}
</style>
